<template>
  <div class="home">
    {{JSON.stringify(userinfo)}}
  </div>
</template>

<script lang="ts">
import { Component, Vue, Prop, Watch } from 'vue-property-decorator';
import { State, Mutation, namespace} from "vuex-class";
@Component({
  components: {
  },
})
export default class Home extends Vue {
  @Prop() show!: boolean // prop接收参数
  @Prop({type:Boolean, default: false}) showTwo!: boolean // prop接收参数-完整
  @Prop() showThree?: boolean // prop接收参数-可选参数

  // 监听用法
  @Watch('$route')
  handle(newVal: any, oldVal: any){
    console.log(newVal, oldVal);
  }

  // vuex用法
  @State('userinfo') userinfo!: {name:string};

  @Mutation("SET_USERINFO") setUserInfo!: (data: {name:string})=> any;

  mounted() {
    this.setUserInfo({name:'1afvsfd'})
  }
}
</script>
